/**
 created by xwy 2018/3/17 17:11
 user: 13720092498@163.com
 **/

import React, {Component} from 'react'
import {Route, Switch} from 'react-router-dom';
import {Button} from 'antd';
import './test.less'

class Tpl extends Component {

  goback = () => {
    console.log(this.props)
    this.props.history.push('/')
  }
  jump = (mes, e) => {
    // this.props.history.push(`${this.props.match.url}/jump${mes}`)
    this.props.history.push({ pathname : `${this.props.match.url}/jump${mes}` ,query : { day: 'Friday' + mes} })
    console.log(this.props)
  }

  componentDidMount() {
    console.log(this.props)
  }

  render() {
    return (
    <div>
      <div className="pad">
        <Button onClick={this.goback} type="primary">back</Button>
      </div>
      <div className="pad">
        <Button onClick={(e) =>this.jump(1, e)} type="primary">jump1</Button>
      </div>
      <div className="pad">
        <Button onClick={(e) =>this.jump(2, e)} type="primary">jump2</Button>
      </div>
      <div className="pad">
        <Button onClick={(e) =>this.jump(3, e)} type="primary">jump3</Button>
      </div>
      <Route path="/test/:topicId" component={Topic} />
      <Route
      exact
      path="/test"
      render={() => <h3>Please select a topic.</h3>}
      />
    </div>
    )
  }
}

// const Tpl = ({match}) => (
//    <div>{match.url}</div>
// )

export default Tpl;

const Topic = ({ match,location }) => (
<div className="test">
  <h3>{JSON.stringify(match)}</h3>
  <h3>{JSON.stringify(location)}</h3>
  <h3>dasdad</h3>
</div>
);